<template>
  <a-modal
    v-model="visible"
    width="50vw"
    :bodyStyle="{ padding: '10px 20px'}"
    title="清消方案维护"
    :confirmLoading="loading"    
    @ok="handleOk"
    @cancel="handleCancel"
  >      
    <div>
      <a-form-model ref="ruleForm" :model="dataForm" :rules="rules" :label-col="{ span: 8 }" :wrapper-col="{ span: 15 }">
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="方案编号">
              <a-input v-model="dataForm.planNoStr" disabled placeholder="自动生成"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="清消方案" prop="wayArr">
              <a-select v-model="dataForm.wayArr" placeholder="请选择"  mode="multiple"   option-label-prop="label" >
                <a-select-option v-for="(item, index) in dict.wayList" :key="'way' +index" :value="item.id" :label="item.wayCode">
                  {{item.wayCode + '-' + item.wayName}}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="方案名称" prop="planName">
              <a-input v-model="dataForm.planName" allowClear placeholder="请输入"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="方案描述" prop="planDesc">
              <a-input v-model="dataForm.planDesc" allowClear placeholder="请输入"/>
            </a-form-model-item>
          </a-col>
        </a-row> 
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="品种配料关系" prop="matRelate">
              <a-select v-model="dataForm.matRelate" placeholder="请选择">
                <a-select-option v-for="(item, index) in dict.matRelateOption" :key="'relate' +index" :value="Number(item.code)">
                  {{item.name}}
                </a-select-option>
              </a-select>                            
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="过敏原特性" prop="matFeature">
              <a-select v-model="dataForm.matFeature" placeholder="请选择" allowClear>
                <a-select-option v-for="(item, index) in dict.matFeatureOption" :key="'featrue' +index" :value="Number(item.code)">
                  {{item.name}}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
        </a-row> 
        <a-row :gutter="24">
            <a-col :span="12">
            <a-form-model-item label="特殊属性关系" prop="specialAttributes">
               <a-select v-model="dataForm.specialAttributes" placeholder="请选择" allowClear>
                <a-select-option v-for="(item, index) in dict.specialAttributes" :key="'featrue' +index" :value="item.code">
                  {{item.name}}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>   
            <a-col :span="12">
            <a-form-model-item label="有机属性" prop="organic">
              <a-switch checked-children="是" un-checked-children="否"  v-model="dataForm.organic" />
            </a-form-model-item>
          </a-col>   
        </a-row>      
         <a-row :gutter="24">
            <a-col :span="12">
            <a-form-model-item label="加严属性" prop="stricture">
              <a-switch checked-children="是" un-checked-children="否"  v-model="dataForm.stricture" />
            </a-form-model-item>
          </a-col>   
        </a-row>         
      </a-form-model>      
    </div>
  </a-modal> 
</template>
<script>
import {getAction,postAction } from '@/api/manage'
import {codeInfoList} from '@/api/codeInfo'
import { ClearLibMixin } from '@/mixins/ClearLibMixin'
export default {
  name: 'ClearAddModal',
   mixins: [ClearLibMixin],
  props: {
  },
  data() {
    return {
      visible: false,
      dataForm: {},
      rules: {
        wayArr: [{ required: true, message: '请选择', trigger: 'change' }],
        matRelate: [{ required: true, message: '请选择', trigger: 'change' }],
        planName: [{ required: true, message: '请输入', trigger: 'blur' }],
        planDesc: [{ required: true, message: '请输入', trigger: 'blur' }],
      },
      loading: false,
      modalType: '', // add新增  upd修改
      url: {
        save: '/hteWashPlan/save',
        wayList:'/hteWashWay/list',
        info: '/hteWashPlan/info/',
        codeInfoList:'/manage/codeInfo/queryByType',
      },      
      // 字典
      dict: {
        matRelateOption: [{value:1,label:'下品种<完全包含>上品种'},{value:2,label:'下品种<不完全包含>上品种'}],
        matFeatureOption: [],
        wayOption:[]
      },
    }
  },
  mounted() {
    this.initDics() // 查询字典
  },
  methods: {
    initDics(){
        const list = [{name:'matFeatureOption',type:`${this.washType}wash_mat_feature`},{name:'specialAttributes',type:`${this.washType}特殊属性关系`} 
      ,{name:'matRelateOption',type:`${this.washType}品种配料关系`}]
      list.forEach((item, index)=>{
        codeInfoList({type:item.type,pageSize:-1,isdel: 0,column:"code",order:"Asc"}).then((res) => {
          if (res.code == 200) {
            this.dict[item.name] = res.result.records
           
          } else {
            this.$message.warning('操作异常:' + res.message)
          }
        })
      }) 
      const that = this;
      getAction(this.url.wayList,{washType:this.washType}).then((res) => {
        if (res.code == 200) {
          that.dict.wayList = res.result;
        } else {
          that.$message.error(res.message)
        }
      })
      
    },
    showVisible(id) {      
      if(id){        
        this.modalType = 'upd'
        this.$set(this.dataForm, 'orderNo', id)
        this.initData(id) // 修改        
      }      
      this.modalType = 'add'
      this.visible = true
      const that = this;
      getAction(this.url.wayList,{washType:this.washType}).then((res) => {
        if (res.code == 200) {
          that.dict.wayList = res.result;
        } else {
          that.$message.error(res.message)
        }
      })            
    },
    handleCancel() {
      this.visible = false
      this.dataForm = {}
      this.fileData = []
      this.$refs.ruleForm.resetFields()
    },
    handleOk(){
      this.loading = true
      const that = this;
      this.$refs.ruleForm.validate(valid => {
        if (valid) {            
          console.log(this.dataForm)
          that.dataForm.wayId = that.dataForm.wayArr.join(',');
          // const url = this.modalType == 'add' ? this.urls.addBurden : this.urls.updateBurden
          that.dataForm.washType = that.washType
          postAction(this.url.save, this.dataForm).then(res => {
            if (res.success) {
              this.$emit('ok')
              this.handleCancel()
              this.$message.success(`${this.modalType == 'add' ? '新增成功' : '修改成功'}`)
            } else {
              this.$message.error('操作失败:' + res.message)
            }
          })                                      
        }        
      })
      this.loading = false
    },
    initData(id){
      this.loading = true
      getAction(this.url.info + id).then(res => {
        if (res.success) {
          this.dataForm = res.result
          if(this.dataForm.wayId){
            const wayIntArr= this.dataForm.wayId.split(',').map(item => {  
              return +item;  
            });
            this.$set(this.dataForm,'wayArr',wayIntArr);
          }
        } else {
          this.$message.error('查询失败:' + res.message)
        }
        this.loading = false
      })
    },    
  },
}
</script>
<style lang="less" scoped>
  /deep/ .ant-input-number,
  /deep/ .ant-select {
    width:100%;
  }
</style>
